<template>
  <div class="err-wrapper">
    <div class="wscn-http404">
      <div class="pic-404">
        <img class="pic-404__parent" :src="img404" alt="404">
        <img class="pic-404__child left" :src="img404Cloud" alt="404">
        <img class="pic-404__child mid" :src="img404Cloud" alt="404">
        <img class="pic-404__child right" :src="img404Cloud" alt="404">
      </div>
      <div class="bullshit">
        <div class="bullshit-wrapper">
          <div class="bullshit__oops">OOPS!</div>
          <div class="bullshit__headline">{{ message }}</div>
          <div class="bullshit__info">
            您没有访问权限，请联系管理员... <br />
            请检查您输入的网址是否正确，请点击以下按钮返回主页
            <!-- 或者发送错误报告 -->
          </div>
          <a href="javascript:void(0)" @click="goBack" class="bullshit__return-home">返回上一页</a>&nbsp;

          <a href="/" class="bullshit__return-home" style="margin-left:10px;">返回首页</a>&nbsp;

          <a href="javascript:void(0)" @click="goLogin" class="bullshit__return-home" style="margin-left:10px;">返回登录页面</a>
        </div>

      </div>
    </div>
  </div>
</template>

<script>
import img404 from '@/assets/images/404.png'
import imgCloud from '@/assets/images/404_cloud.png'

export default {
  data () {
    return {
      img404: img404,
      img404Cloud: imgCloud
    }
  },
  computed: {
    message () {
      return '页面找不到了......'
    }
  },
  methods: {
    goLogin () {
      window.sessionStorage.clear()
      window.localStorage.clear()
      this.$router.push({ name: 'LoginPage' })
    },
    goBack () {
      this.$router.go(-1)
    }
  }
}
</script>
